@use "Content/scss/colors";
@use "Content/scss/sizes";

.edit-ai-agent {
    .trimming-advanced {
        .accordion-button {
            border-radius: sizes.$gutter-sm !important;
            padding: sizes.$gutter-sm !important;
            background-color: colors.$panel-bg-2 !important;
        }
    }

    .edit-ai-agent-parameters-section {
        .parameters-grid {
            border-radius: sizes.$gutter-xs !important;
            border: 1px solid colors.$border-color-light-var;
            background: colors.$panel-bg-1;

            .parameters-header {
                border-radius: sizes.$gutter-xs sizes.$gutter-xs 0 0 !important;

                .parameters-grid-header {
                    display: grid;
                    grid-template-columns: 1fr 3fr 80px;

                    .parameter-name-header,
                    .parameter-description-header,
                    .parameter-actions-header {
                        padding: sizes.$gutter-xxs;
                        border-bottom: 1px solid colors.$border-color-light-var;
                    }

                    .parameter-name-header,
                    .parameter-description-header {
                        border-right: 1px solid colors.$border-color-light-var;
                    }
                }
            }

            .parameters-list {
                .parameter-row {
                    &:last-child {
                        border-bottom: none !important;
                    }

                    .parameters-grid-row {
                        display: grid;
                        grid-template-columns: 1fr 3fr 80px;
                        background-color: colors.$input-bg-var;

                        .parameter-name-cell,
                        .parameter-description-cell {
                            border-right: 1px solid colors.$border-color-light-var;
                        }
                    }
                }
            }

            .parameter-header,
            .parameter-row {
                border-bottom: 1px solid colors.$border-color-light-var;
            }
        }
    }

    .tool-icon {
        width: 32px;
        height: 32px;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: sizes.$border-radius-sm;
    }

    table {
        clip-path: content-box;
        margin-bottom: 0 !important;
    }
}
